<template>
    <div class='report'>
        
        <p class="top_p"><el-button type="text" @click="goHome" class="sy">首页</el-button>&emsp;/&emsp;数据统计&emsp;/&emsp;数据报表</p>
        
        <div class="con">
            <div
                id="main"
                style="width: 750px;height:400px;"
            ></div>
        </div>
    </div>
</template>

<script>
import { getAlllist } from "@/api/getData.js";
import * as echarts from "echarts";
export default {
  data() {
    return {
      data: {}
    };
  },
  mounted() {
    this.list();
  },
  methods: {
       goHome() {
      this.$router.push("/greet");
    },
    list() {
      getAlllist().then(res => {
        this.data = res.data;
        var myChart = echarts.init(document.getElementById("main"));
        myChart.setOption(this.data);
      });
    }
  },
  components: {}
};
</script>

<style >
  .top {
    margin-top: 14px;
    font-size: 12px;
    
  }
  .top a {
      font-weight: bold;
    }
  .con {
    width: 98%;
    background: white;
    border-radius: 4px;
    margin: 10px 20px;
    margin-left: 0px;
    box-sizing: border-box;
    padding: 30px 18px;
  }

</style>
